<script>
const app = getApp();
export default {
  name: "note-detail-item",
  props: {
    shopsDetailsLists: {
      type: Array,
      default: []
    },
  },
  data() {
    return {
      baseUrl: app.globalData.baseUrl,
      imgurlBwc: app.globalData.imgurlBwc,
      isTabActive: true,
      isTabDate: false,
      startTime: '',
      endTime: '',

    }
  },
  methods: {
    //图片放大预览
    previewImage(imgUrl,e) {
      console.log('图片==', imgUrl, e)
      let imgArr = []
      this.shopsDetailsLists.forEach(function (item, index) {
        item.order_notes.forEach(function (noteItem, noteIndex) {
          if (noteItem.order_id === item.id && noteItem.id === e){
            noteItem.images.forEach(function (imgItem, imgIndex) {
              imgArr.push(imgItem)
            })
          }
        })
      })
      console.log('图片==', imgArr)
      uni.previewImage({
        current: imgUrl, // 当前显示图片的索引，默认是0
        urls: imgArr, // 需要预览的图片HTTP链接列表
      });
    },
    //笔记要求弹窗
    noteRequireFun(data){
      console.log("笔记要求", data)
      this.$emit("noteRequireFun", data)
    },
    //  复制笔记链接
    copy_no(url) {
      uni.setClipboardData({
        data: url, // e是你要保存的内容
        success: function () {
          uni.showToast({
            title: '复制成功',
            icon: 'none'
          })
        }
      });
    },
  },
}
</script>

<template>
  <view>
    <!--笔记详情列表数据-->
    <view class="shop-list-item" v-for="(item, index) in shopsDetailsLists" :key="index">
      <view class="shop-list-item-head">
        <view class="shop-list-item-img">
          <image :src="item.logo" mode="aspectFill" class="shop-item-img"></image>
        </view>
        <view class="shop-list-item-right">
          <view class="shop-list-item-title ellipsis-one-line">{{ item.package_name }}</view>
          <view class="shop-list-item-subt ellipsis-two-line">笔记不满意？ | 可联系服务群内业务经理修改笔记</view>
        </view>
      </view>
      <view class="shop-list-item-warp">
        <view class="shop-list-item-warp-arow">
          <text class="shop-list-item-warp-arow-text">实付金额</text>
          <text class="shop-list-item-warp-arow-textr price">￥{{item.price}}</text>
        </view>
        <view class="shop-list-item-warp-arow">
          <text class="shop-list-item-warp-arow-text">下单时间</text>
          <text class="shop-list-item-warp-arow-textr">{{item.create_time}}</text>
        </view>
        <view class="shop-list-item-warp-arow arowRight">
          <view style="width: calc(100% - 100rpx)">
            <text class="shop-list-item-warp-arow-text">笔记要求</text>
            <text class="shop-list-item-warp-arow-textr ellipsis-one-line">{{item.activity_ask}}</text>
          </view>
          <view @click="noteRequireFun(item.activity_ask)" class="arowRight-textr">
            <text>详情</text>
            <u-icon name="arrow-right" color="#B9B9B9" size="28"></u-icon>
          </view>
        </view>
        <view class="shop-list-item-warp-arow">
          <text class="shop-list-item-warp-arow-text">核销时间</text>
          <text class="shop-list-item-warp-arow-textr">{{item.verify_time}}</text>
        </view>
        <view class="shop-list-item-warp-arow">
          <text class="shop-list-item-warp-arow-text">核销类型</text>
          <text v-if="item.is_self_verify == 1" class="shop-list-item-warp-arow-textr">自主核销</text>
          <text v-if="item.is_self_verify == 0" class="shop-list-item-warp-arow-textr">扫码核销</text>
        </view>
      </view>
      <view class="shop-list-item-link">
        <view v-for="(linkItem, linkIndex) in item.order_notes" :key="linkIndex" class="shop-list-item-link-item">
          <view class="shop-list-item-link-title">
            <image :src="imgurlBwc + linkItem.image" mode="aspectFill" class="shop-list-item-link-img"></image>
            <text>{{linkItem.title}}笔记截图及链接</text>
          </view>
          <view class="shop-list-item-link-warp">
            <view class="shop-list-item-link-warp-left ellipsis-one-line">笔记链接：{{linkItem.url}}</view>
            <view @click="copy_no(linkItem.url)" style="color: #888888">复制</view>
            <!--<image @click="copy_no(linkItem.url)" :src="imgurlBwc + 'note/link-icon.png'" class="shop-list-item-link-img"></image>-->
          </view>
          <view class="shop-list-item-link-warp">
            <view class="shop-list-item-link-warp-left ellipsis-one-line">订单号：{{item.order_no}}</view>
            <view @click="copy_no(item.order_no)" style="color: #888888">复制</view>
          </view>
          <view class="shop-list-item-link-imgBox">
            <scroll-view class="u-scroll-view" scroll-x="true">
              <view v-for="(imgItem, imgIndex) in linkItem.images" :key="imgIndex" class="shop-list-item-link-imgBox-item">
                <image @click="previewImage(imgItem,linkItem.id)" :src="imgItem" mode="aspectFill" class="shop-list-item-link-img"></image>
              </view>
            </scroll-view>
          </view>
        </view>
      </view>
    </view>

  </view>
</template>

<style >

</style>